.completion-container {
	min-height: 100%;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: #fff;
	
}
.completion-head {
	height: calc(44px + 532rpx + var(--status-bar-height));
	background-position: center bottom;
	background-size: cover;
	width: 750rpx;
	position: absolute;
	top: 0;
	box-sizing: 1;
}
.completion-body {
	width: 614rpx;
	height: 642rpx;
	margin-top: calc(44px + 56rpx + var(--status-bar-height));
	z-index: 10;
	.completion-body-text {
		height: 58rpx;
		font-size: 50rpx;
		color: #ffffff;
		display: flex;
		align-items: center;
		font-family: FZRUIZYS_ZHONG--GB1-0, FZRUIZYS_ZHONG--GB1;
		width: 100%;
	}
	.completion-body-block {
		position: relative;
		margin-top: 50rpx;
		width: 614rpx;
		.completion-body-front,
		.completion-body-back {
			width: 550rpx;
			height: 550rpx;
			border-radius: 35rpx;
			position: absolute;
			display: flex;
			flex-direction: column;
			align-items: center;
		}
		.completion-body-front {
			background: #ffffff;
			box-shadow: 0px 2rpx 2rpx 2rpx rgba(0, 0, 0, 0.12);
			z-index: 10;
			padding: 50rpx;
			justify-content: center;
			padding-top: 100rpx;
			.next-btn {
				width: 340rpx;
				height: 70rpx;
				background: linear-gradient(297deg, #ed4f5d 0%, #fb7a8e 100%);
				border-radius: 35rpx;
				margin-top: 60rpx;

				color: #fff;
				font-size: 28rpx;
			}
			.nickname-roll {
				width: 100%;
				display: flex;
				justify-content: flex-end;
				margin-bottom: 10rpx;
				height: 40rpx;
				.nickname-roll-btn {
					height: 40rpx;
					border-radius: 22rpx;
					border: 1rpx solid #979797;
					color: #979797;
					padding: 0 17rpx;
					display: flex;
					align-items: center;
					font-size: 24rpx;
				}
			}
			.completion-body-front-cell {
				width: 100%;
				height: 100rpx;
				display: flex;
				align-items: center;
				justify-content: flex-end;
				.completion-body-front-cell-label {
					font-size: 30rpx;
					font-weight: 400;
				}
				.completion-body-front-cell-input {
					flex: 1;
					border-bottom: 1rpx solid rgba(228, 228, 228, 1);
					height: 60rpx;
					margin-left: 6rpx;
					display: flex;
					align-items: center;
					input {
						border: 0;
						height: 60rpx;
						width: 100%;
						font-size: 30rpx;
						color: #333;
					}
					.placeholder {
						font-size: 28rpx;
						font-weight: 400;
						color: #979797;
					}
				}
			}
		}
		.completion-body-back {
			background: linear-gradient(90deg, rgba(248, 89, 98, 0.4) 0%, rgba(255, 179, 54, 0.4) 100%);
			top: 92rpx;
			right: 0;
			z-index: 1;
			font-size: 32rpx;
			color: #ffffff;
			padding-bottom: 28rpx;
			justify-content: flex-end;
		}
	}
}
